import QtQuick 2.9

Canvas{
    id:root
    x:320
    y:200
    width: 240
    height: 120
    onPaint: {
        var ctx = getContext("2d");
        ctx.lineWidth = 4;
        ctx.strokeStyle = "blue";

        // translate x/y coordinate system
        ctx.translate(120, 60);

        // draw path
        ctx.beginPath();
        ctx.rect(-20, -20, 40, 40);
        ctx.stroke();

        // rotate coordinate system
        ctx.rotate(Math.PI/4);
        ctx.strokeStyle = "green";

        // draw path
        ctx.beginPath();
        ctx.rect(-20, -20, 40, 40);
        ctx.stroke();
    }
}
